<!DOCTYPE HTML>
<html  lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css">
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-hatchetAgent-edit" th:object="${hatchetAgent}">
            <input id="iD" name="iD" th:field="*{iD}"  type="hidden">
            <div class="form-group">	
				<label class="col-sm-3 control-label">代理商编号：</label>
					<div class="form-control-static" th:text="${hatchetAgent.agentNo}"></div>
			</div>
			<div class="form-group">	
				<label class="col-sm-3 control-label">代理商名称：</label>
					<div class="form-control-static" th:text="${hatchetAgent.agentName}"></div>
			</div>
			<div class="form-group">	
				<label class="col-sm-3 control-label">升级码数量：</label>
					<div class="form-control-static" th:text="${hatchetAgent.fastCount}"></div>
			</div>
			<!-- <div class="form-group">	
				<label class="col-sm-3 control-label">  更新至：</label>
				<input style="height: 32px;"  id="fastCount" name="fastCount"  type="text">
			</div> -->
			
			<div class="form-group">	
				<label class="col-sm-3 control-label">开户行所在地:</label>
				
				<input type= "hidden" name="bankProvinceIdSelect" id="bankProvinceIdSelect" style="height: 32px;"  th:value="${hatchetAgent.bankProvinceId }"/>
				<input type= "hidden" name="bankCityIdSelect" id="bankCityIdSelect"  style="height: 32px;" th:value="${hatchetAgent.bankCityId}"/>
				<input type= "hidden" name="bankAreaIdSelect" id="bankAreaIdSelect" style="height: 32px;"  th:value="${hatchetAgent.bankAreaId}"/>
			    <!-- <select style="margin-left: 10px;width: 175px;" id="bankProvinceId" name="bankProvinceId" class="hkrt-required bootstrap-select"><option>请选择</option></select> -->
			    <!-- 存放银行省份id -->
			    <input type="hidden" id="bankProvinceIdList" name="bankProvinceId">
			    <input  type= "text" style="height: 32px;" id="bankProvinceId"  value=""/>&nbsp;&nbsp;&nbsp;
			    <select  id="bankCityId" style="height: 32px;" name="bankCityId" ><option value=''>请选择</option></select>&nbsp;&nbsp;&nbsp;
			    <select  id="bankAreaId"  style="height: 32px;"name="bankAreaId" ><option value=''>请选择</option></select><br>
			</div>	
			
			<div class="form-group">	
				<label class="col-sm-3 control-label">开户银行:</label>
				 <input type= "hidden" name="issbankIdSelect" id="issbankIdSelect" style="height: 32px;" th:value="${hatchetAgent.issbankId }"/>
		    	<input style="height: 32px;" type= "text" id="issbankId" name ="" class="hkrt-required " value=""/><br>
			    <input type="hidden" id="issbankIdList" name="issbankId">
			    <br>
			    <label style="margin-left: 100px;" >银行账户名称:</label>
			    <input style="height: 32px;margin-left: 5px;;" type= "text" id="accountName" name="accountName" class="hkrt-required " th:value="${hatchetAgent.accountName}"/>
			   <br><br>
			    <label style="margin-left: 100px;" >银行账户账号:</label>
			    <input style="height: 32px;margin-left: 5px;" type= "text" id="bankAccount" name="bankAccount" class="hkrt-required " th:value="${hatchetAgent.bankAccount}"/><br>
			</div>	
			
			<div class="form-group">	
				<label class="col-sm-3 control-label">  地址:：</label>
				<textarea  rows="3" name="aDDRESS" cols="50" style="width:458px;height: 50px;" class="hkrt-required agentInfo bootstrap-textarea"  th:text="${hatchetAgent.aDDRESS}"></textarea>
			</div>
		</form>
    </div>
    <div th:include="include::footer"></div>
  	<script type="text/javascript">
		var prefix = ctx + "system/hatchetAgent";
		$("#form-hatchetAgent-edit").validate({
			rules:{
			}
		});
		
		function submitHandler() {
	        if ($.validate.form()) {
	            $.operate.save(prefix + "/edit", $('#form-hatchetAgent-edit').serialize());
	        }
	    }
		
		var prefix = ctx + "system/hatchetAgent";
		var issbankList = [];
		$(function(){
			getBankProvince();
			getProvince();
			banks();
			$("#issbankId").autocomplete({
				source: banks(),
				select:function(event, ui) {
					$("#issbankIdList").val(ui.item.id)
					$("#issbankId").val(ui.item.value);
				}
			});
			
			//查询地区
			$("#cityId").bind("change",function(){
				var cityId=$("#cityId").val();
				getAreaByCityId(cityId);			
			});
			
			$("#bankProvinceId").autocomplete({
				source: getProvince(),
				select:function(event, ui) {
					$("#bankProvinceIdList").val(ui.item.id)
					var provinceId = $("#bankProvinceIdList").val();
					$("#bankProvinceId").val(ui.item.value);
					$("#bankProvinceIdList").val(ui.item.id);
					getBankCityByProvinceId(provinceId);
				}
			});
			//查询市下的区
			$("#bankCityId").bind("change",function(){
				var cityId=$("#bankCityId").val();
				getBankAreaByCityId(cityId);		
			});
		});	

		//获取省列表
		function getProvince() {
			var array=[];
			$.ajax({
				url: prefix + "/getAllProvince",
				async:false,
				type:"POST",
				data:{},
				success: function(result) {
					$.each(result, function(i,v) {
						if (v.divisionName != null && v.divisionName != undefined) {
							var arrays = {};
							arrays.value = v.divisionName;
							arrays.id = v.id;
							array.push(arrays);
						}
					});
				}
			});
			return array;
		}

		//查询省列表
		function getBankProvince() {
			var array=[];
			var provinceId =$("#bankProvinceIdSelect").val();
			$.ajax({
				url: prefix + "/getAllProvince",
				async:false,
				type:"POST",
				data:{},
				success: function(result) {
					$.each(result, function(i,v) {
						if(provinceId == v.id) {
							$("#bankProvinceId").val(v.divisionName);
							$("#bankProvinceIdList").val(v.id);
						}else{
							var arrays = {};
							arrays.value = v.divisionName;
							arrays.id = v.id;
							array.push(arrays);
						}
					});
				}
			});
			if(provinceId!=""){		// 加载下一步
				getBankCityByProvinceId(provinceId);
			} 
			return array;
		}

		// 获取市列表
		function getBankCityByProvinceId(provinceId,_clear) {
			$("#bankCityId").empty();
			var _default = "<option value=''>请选择</option>";
			var optionStatus=_default;
			var cityOrarea = $("#bankCityIdSelect").val();
			$.ajax({
				url : prefix + '/getHatchetAdministrativeDivisionsByChinaAreaId',
				async : false,
				type : "POST",
				data : {
					"parentId" : provinceId
				},
				success : function(result) {
					$.each(result, function(k, v) {
						if (v.id == cityOrarea) {
							optionStatus=optionStatus+"<option id='"+v.id+"'  value='"+v.id+"' selected='selected'>"+v.divisionName+"</option>";
						} else {
							optionStatus=optionStatus+"<option id='"+v.id+"'  value='"+v.id+"' >"+v.divisionName+"</option>";
						}
					});
				}
			});	
			$("#bankCityId").append(optionStatus);
			if(!_clear, cityOrarea!=""){
				getBankAreaByCityId(cityOrarea);
			} else {
				$("#bankAreaId").html('').append(optionStatus);
			}
		};
		// 获取某个市下的地区列表
		function getBankAreaByCityId(area){
			$("#bankAreaId").empty();
			$("#bankAreaId").append("<option value=''>请选择</option>");
			var cityOrarea = $("#bankAreaIdSelect").val();
			$.ajax({
				  url: prefix +'/getHatchetAdministrativeDivisionsByChinaAreaId',
				  async:false,
				  type:"POST",
				  data:{
					  "parentId":area
				  },
				  success : function(result) {
						$.each(result, function(k, v) {
							if (v.id == cityOrarea) {
								$("#bankAreaId").append("<option value='"+v.id+"' selected='selected' >"+v.divisionName+"</option>");
							} else {
								$("#bankAreaId").append("<option value='"+v.id+"' >"+v.divisionName+"</option>");
							}
						});
					}
			});
			
			$("#bankProvinceIdSelect").val('');
			$("#bankCityIdSelect").val('');
			$("#bankAreaIdSelect").val('');
		};


		//查询银行列表
		function banks() {
			var array=[];
			var bank =$("#issbankIdSelect").val();
			$.ajax({
				url: prefix + "/getIssBankAll",
				async:false,
				type:"POST",
				data:{},
				success: function(result) {
					$.each(result, function(i,v) {
						if(bank == v.id) {
							$("#issbankId").val(v.bankName);
							$("#issbankIdList").val(v.id);
						}else{
							var arrays = {};
							arrays.value = v.bankName;
							arrays.id = v.id;
							array.push(arrays);
						}
					});
				}
			});
			return array;
		}
	</script>
</body>
</html>
